<template>
  <div class="dict">
    <ele-left-right-master-sub-two-table
      ref="table"
      title="物料信息"
      :masterColumn="masterColumn"
      :subColumn="subColumn"
      :sub2Column="sub2Column"
      :formConfig="formConfig"
      :operateList="operateList"
      :subOperateList="operateList"
      :sub2OperateList="operateList"
      :masterApi="mesTmMaterialBasePage"
      height="700"
      :subApi="mesTmMaterialBrandPage"
      :sub2Api="mesTmMaterialUnitPage"
      @handleOperateEvent="handleMasterOperateEvent"
      @handleSubOperateEvent="handleSubOperateEvent"
      @handleSub2OperateEvent="handleSub2OperateEvent"
      :subRequestParams="subRequestParams"
      :sub2RequestParams="sub2RequestParams"
      @dataFlushed="onDataFlushed($event)"
    />
    <ele-form-drawer
      :isLoading="isLoading"
      v-model="formDataDialog"
      v-bind="formDescDialog"
      :request-fn="handleSubmit"
      :visible.sync="visible"
      :title="title"
    >
    </ele-form-drawer>
    <ele-form-drawer
      :isLoading="isLoading"
      v-model="formDataDialog"
      v-bind="formDescDialogSub"
      :request-fn="handleSubmitSub"
      :visible.sync="visibleSub"
      :title="title"
    >
    </ele-form-drawer>
    <ele-form-drawer
      :isLoading="isLoading"
      :title="title"
      :visible.sync="mixinDialogVisible"
      v-model="formDataDialog"
      v-bind="formDescDialogTwo"
      :request-fn="handleSubmitTwo"
    ></ele-form-drawer>
  </div>
</template>
<script>
import {
  formConfig,
  formConfigDialog,
  formDescDialog,
  formDescDialogSub, formDescDialogTwo,
  operateList,
  rowConfig, sub2RowConfig,
  subRowConfig
} from './config'
import {
  reinspectionPartPage,
  reinspectionDescPage,
  reinspectionRepairPage,
  reinspectionPartList,
  reinspectionDescList,
  reinspectionRepairList,
  reinspectionPartDeleteById,
  reinspectionDescDeleteById,
  reinspectionRepairDeleteById,
  reinspectionPartCreate,
  reinspectionDescCreate,
  reinspectionRepairCreate,
  reinspectionPartUpdate,
  reinspectionDescUpdate,
  reinspectionRepairUpdate
} from '@/api/reinspection/items'
import {repairItemPage, repairItemPage as getMixinList} from "@/api/repair/item";
import {getDict} from "@/api/common";
import {
  mesTmMaterialBaseCreate,
  mesTmMaterialBaseDeleteById,
  mesTmMaterialBasePage,
  mesTmMaterialBaseUpdate
} from "@/api/materials/tmMaterialBase";
import {
  mesTmMaterialBrandCreate,
  mesTmMaterialBrandDeleteById,
  mesTmMaterialBrandPage,
  mesTmMaterialBrandUpdate
} from "@/api/materials/brand";
import {
  mesTmMaterialUnitById,
  mesTmMaterialUnitCreate,
  mesTmMaterialUnitDeleteById,
  mesTmMaterialUnitPage,
  mesTmMaterialUnitUpdate
} from "@/api/materials/unit";
export default {
  name: 'reinspectionParts',
  data() {
    return {
      mixinDialogVisible: false, //表格弹框隐藏显示
      getMixinList, // 获取弹框数据接口
      hasMixinFooter: true, // 是否需要底部按钮默认true
      mixinSearchDialog: {
        inline: true,
        formDesc: {
          repairProf: {
            type: "select",
            label: '工种',
            prop: {
              text: "description",
              value: "value"
            },
            // Promise 对象
            options: async (data) => {
              const list = await getDict("work_type")
              return list.data.result
            }
          },
          repairCateFir: {
            type: "input",
            label: '一级分类',
          },
          repairCateSec: {
            type: "input",
            label: '二级分类',
          },
          repairItem: {
            type: "input",
            label: '维修项目',
          },
          isBase: {
            label: "基础整备项",
            type: "select",
            options: [
              { text: "是", value: "Y" },
              { text: "否", value: "N" }
            ]
          }
        },
      },
      mixinDialogColumn: [
        {
          type: "selection",
        },
        {
          type: "index",
          label: $i18n.t("common.order"),
          width: 60,
        },
        {
          prop: "repairProf",
          label: '工种',
          optionProp: {
            value: "value",
            label: "description",
          },
          option: async (data) => {
            const list = await getDict("work_type")
            return list.data.result;
          },
          showOverflowTooltip: true,
        },
        {
          prop: 'repairCateFir',
          label: '一级分类',
          showOverflowTooltip: true
        },
        {
          prop: 'repairCateSec',
          label: '二级分类',
          showOverflowTooltip: true
        },
        {
          prop: 'repairItem',
          label: '维修项目',
          showOverflowTooltip: true
        },
        {
          prop: 'repairHours',
          label: '工时',
          showOverflowTooltip: true
        },
        {
          prop: 'repairHoursUnitPrice',
          label: '工时单价',
          showOverflowTooltip: true
        },
        {
          prop: 'repairHoursTotalPrice',
          label: '工时总价',
          showOverflowTooltip: true
        },
        {
          prop: 'isBase',
          label: '基础整备项',
          showOverflowTooltip: true,
          render: (h, scope) => {
            const qmiTestStep = { 'Y': '是', 'N': '否' }
            return (
              <span>{qmiTestStep[scope.row.isBase] || ''}</span>
            )
          }
        },
        {
          prop: 'isRepair',
          label: '使用物料',
          showOverflowTooltip: true,
          render: (h, scope) => {
            const qmiTestStep = { 'Y': '是', 'N': '否' }
            return (
              <span>{qmiTestStep[scope.row.isRepair] || ''}</span>
            )
          }
        },
        {
          prop: 'repairMaterialName',
          label: '使用物料名称',
          showOverflowTooltip: true,
        },
      ],
      operateList, //左侧操作按钮
      formConfig, //搜索配置
      mesTmMaterialBasePage,
      mesTmMaterialBrandPage,
      mesTmMaterialUnitPage,
      reinspectionPartPage,
      reinspectionDescPage,
      reinspectionRepairPage,
      subRequestParams: {
        column: [{ key : 'materialCode' ,value: 'materialCode' }]
      },
      sub2RequestParams: {
        column: [{ key : 'materialBrandId' ,value: 'id' },{ key : 'materialCode' ,value: 'materialCode' }]
      },
      masterColumn: [
        {
          prop: "materialType",
          label: '类型',
          optionProp: {
            value: "value",
            label: "description",
          },
          option: async (data) => {
            const list = await getDict("tm_material_base")
            return list.data.result;
          },
          showOverflowTooltip: true,
        },
        {
          prop: 'materialCode',
          label: '物料编号'
        },
        {
          prop: 'materialName',
          label: '物料名称'
        },
        {
          prop: 'materialUnit',
          label: '物料单位',
          optionProp: {
            value: "value",
            label: "description",
          },
          option: async (data) => {
            const list = await getDict("material_unit")
            return list.data.result;
          },
          showOverflowTooltip: true,
        },
        {
          prop: 'operate',
          label: this.$t('common.operation'),
          width: 160,
          render: (h, scope) => {
            return (
              <ele-row-operation
                scope={scope}
                rowConfig={rowConfig}
                onRowOperate={this.leftRowOperate}></ele-row-operation>
            )
          }
        }
      ],
      subColumn: [
        {
          prop: 'materialCode',
          label: '物料编码',
          minWidth: 140,
          showOverflowTooltip: true
        },
        {
          prop: 'brand',
          label: '品牌',
          minWidth: 140,
          showOverflowTooltip: true
        },
        {
          prop: 'createByName',
          label: '创建人',
          minWidth: 140,
          showOverflowTooltip: true
        },
        {
          prop: 'createTime',
          label: '创建时间',
          minWidth: 140,
          showOverflowTooltip: true
        },
        {
          prop: 'operate',
          label: this.$t('common.operation'),
          render: (h, scope) => {
            return (
              <ele-row-operation
                scope={scope}
                rowConfig={subRowConfig}
                onRowOperate={this.rightRowOperate}></ele-row-operation>
            )
          }
        }
      ],
      sub2Column: [
        {
          prop: 'materialCode',
          label: '物料编码',
          minWidth: 140,
          showOverflowTooltip: true
        },
        {
          prop: 'unit',
          label: '规格',
          minWidth: 100,
          showOverflowTooltip: true
        },
        {
          prop: 'packUnit',
          label: '订货单位',
          minWidth: 100,
          showOverflowTooltip: true
        },
        {
          prop: 'packCapacity',
          label: '包装容量',
          minWidth: 100,
          showOverflowTooltip: true
        },
        {
          prop: 'countType',
          label: '统计方式',
          minWidth: 100,
          showOverflowTooltip: true,
          render: (h, scope) => {
            const status = scope.row.countType == '1' ? "同物料基础单位" : "同订货单位"
            return <div>{status}</div>
          },
        },
        {
          prop: 'createByName',
          label: '创建人',
          minWidth: 140,
          showOverflowTooltip: true
        },
        {
          prop: 'createTime',
          label: '创建时间',
          minWidth: 140,
          showOverflowTooltip: true
        },

        {
          prop: 'operate',
          label: this.$t('common.operation'),
          render: (h, scope) => {
            return (
              <ele-row-operation
                scope={scope}
                rowConfig={sub2RowConfig}
                onRowOperate={this.rightRow2Operate}></ele-row-operation>
            )
          }
        }
      ],
      title: '',
      isLoading: false,
      visible: false,
      visibleSub: false,
      formDescDialog,
      formConfigDialog,
      formDescDialogSub,
      formDescDialogTwo,
      formDataDialog: {},
      tableChange: 'left',
      editId: '',
      materialCodeSel: '',
      materialBrandIdSel: ''
      // systemFlag: ''
    }
  },
  created() {},
  methods: {
    // 弹框表格，双击表格，或者点击确定 返回选中数据
    getSelectMixin(data) {
      let ids = ''
      const length = data.length
      data.forEach(function (item, index) {
        ids += item.id
        if (index !== length - 1) {
          ids += ','
        }
      })
      // 调试完成记得删除控制台打印
      console.log(ids);
      reinspectionRepairCreate(
        {
          repairId:ids,
          materialBrandIdSel:this.descId
      }
      ).then((res) => {
        this.$refs.table.sub2Refresh(true)
        this.visibleSub2 = false
      })
    },
    //
    onDataFlushed(value) {
      if(value.type === 'master')
      {
        this.materialCodeSel = value.value.materialCode
        this.materialBrandIdSel = ''
      }
      else if(value.type === 'sub')
      {
        this.materialCodeSel = value.value.materialCode
        this.materialBrandIdSel = value.value.id
      }
      else
      {
        this.materialCodeSel = ''
        this.materialBrandIdSel = ''
      }
    },
    //左边表格顶部的按钮事件
    handleMasterOperateEvent(data) {
      this.title = '新增'
      this.tableChange = 'left'
      this.formDataDialog = {}
      this.visible = true
    },
    //左边行操作事件
    leftRowOperate({ handleName, row }) {
      const fun = {
        edit: () => {
          this.title = '编辑'
          this.tableChange = 'left'
          this.visible = true
          this.edit(row)
        },
        delete: () => {
          // let systemFlag = row.systemFlag
          this.$confirm(
            "此操作将删除该数据及关联明细数据, 是否继续?",
            this.$i18n.t('common.tip'),
            {
              confirmButtonText: this.$i18n.t('common.ok'),
              cancelButtonText: this.$i18n.t('common.cancel'),
              type: 'warning'
            }
          )
            .then(() => {
              mesTmMaterialBaseDeleteById(row.id).then((res) => {
                this.$message({
                  type: 'success',
                  message: this.$t('common.deleteSuccess')
                })
                this.$refs.table.refresh(true)
              })
            })
            .catch(() => {
              this.$message({
                type: 'info',
                message: this.$i18n.t('common.cancel')
              })
            })
        }
      }
      fun[handleName] && fun[handleName]()
    },
    edit(data) {
      this.formDataDialog = { ...data }
    },
    editConfig(data) {
      this.formDataDialog = {
        // systemFlag: data.systemFlag
      }
    },
    //右边表格顶部的按钮事件
    handleSubOperateEvent(data) {
      if (this.materialCodeSel == '') {
        this.$message.error('未选择物料')
        return
      }
      this.title = '新增'
      this.tableChange = 'right'
      this.formDataDialog = {
        materialCode : this.materialCodeSel
      }
      this.visibleSub = true
    },
    //右边表格顶部的按钮事件
    handleSub2OperateEvent(data) {
      if (this.materialBrandIdSel == '') {
        this.$message.error('未选择品牌')
        return
      }
      this.title = '新增'
      this.tableChange = 'right'
      this.formDataDialog = {
        materialCode : this.materialCodeSel,
        materialBrandId: this.materialBrandIdSel
      }
      this.mixinDialogVisible = true
    },
    //右边行操作事件
    rightRowOperate({ handleName, row }) {
      const fun = {
        editSub: () => {
          this.title = '编辑'
          this.tableChange = 'right'
          this.editSub(row)
          this.visibleSub = true
        },
        deleteSub: () => {
          this.$confirm(
            "此操作将删除该数据及关联明细数据, 是否继续?",
            this.$i18n.t('common.tip'),
            {
              confirmButtonText: '确认',
              cancelButtonText: '取消',
              type: 'warning'
            }
          )
            .then(() => {
              mesTmMaterialBrandDeleteById(row.id).then((res) => {
                this.$message({
                  type: 'success',
                  message: '删除成功'
                })
                this.$refs.table.subRefresh(true)
              })
            })
            .catch(() => {
              this.$message({
                type: 'info',
                message: this.$i18n.t('common.cancel')
              })
            })
        },
      }
      fun[handleName] && fun[handleName]()
    },
    rightRow2Operate({ handleName, row }) {
      console.warn(handleName)
      const fun = {
        deleteSub2: () => {
          this.$confirm(
            this.$t('common.deleteSingle', { name: '条数据' }),
            this.$i18n.t('common.tip'),
            {
              confirmButtonText: '确认',
              cancelButtonText: '取消',
              type: 'warning'
            }
          )
            .then(() => {
              mesTmMaterialUnitDeleteById(row.id).then((res) => {
                this.$message({
                  type: 'success',
                  message: '删除成功'
                })
                this.$refs.table.sub2Refresh(true)
              })
            })
            .catch(() => {
              this.$message({
                type: 'info',
                message: this.$i18n.t('common.cancel')
              })
            })
        },
        editSub2: () => {
          this.title = '编辑'
          this.tableChange = 'right'
          this.editSub2(row)
          this.mixinDialogVisible = true
        },
      }
      fun[handleName] && fun[handleName]()
    },
    editSub2(row){

      mesTmMaterialUnitById(row.id).then((res)=>{
        this.formDataDialog = res.data.result
      })
      //  = {}
    },
    editSub(data) {
      this.formDataDialog = {
        ...data,
      }
    },
    handleSubmit(data) {
      if (this.title == '新增' && this.tableChange == 'left') {
        mesTmMaterialBaseCreate({
          ...data,
        }).then((res) => {
          this.$refs.table.refresh(true)
          this.visible = false
        })
      } else if (this.title == '编辑' && this.tableChange == 'left') {
        mesTmMaterialBaseUpdate({
          ...data,
        }).then((res) => {
          this.$refs.table.refresh(true)
          this.visible = false
        })
      }
    },
    handleSubmitSub(data) {
      if (this.title == '新增' && this.tableChange == 'right') {
        mesTmMaterialBrandCreate({
          ...data,
          materialCode:this.materialCodeSel
        }).then((res) => {
          this.$refs.table.subRefresh(true)
          this.visibleSub = false
        })
      } else if (this.title == '编辑' && this.tableChange == 'right') {
        mesTmMaterialBrandUpdate({
          ...data,
        }).then((res) => {
          this.$refs.table.subRefresh(true)
          this.visibleSub = false
        })
      }
    },
    handleSubmitTwo(data) {
      if (this.title == '新增' && this.tableChange == 'right') {
        mesTmMaterialUnitCreate({
          ...data,
          materialCode:this.materialCodeSel
        }).then((res) => {
          this.$refs.table.sub2Refresh(true)
          this.mixinDialogVisible = false
        })
      } else if (this.title == '编辑' && this.tableChange == 'right') {
        mesTmMaterialUnitUpdate({
          ...data,
        }).then((res) => {
          this.$refs.table.sub2Refresh(true)
          this.mixinDialogVisible = false
        })
      }
    },
  }
}
</script>
<style lang="scss" scoped>
</style>
